<!-- 加载layout.html -->
{{extend('./layout.html')}}

{{#block('main')}}
<div class="main-container">
	<div class="padding-md">
		<h2 class="header-text">
			添加学生
			<span class="sub-header">
				add class
			</span>
		</h2>
		<div class="smart-widget m-top-lg widget-dark-blue">
			<div class="smart-widget-header">
				请填写学生信息
				<span class="smart-widget-option">
					<span class="refresh-icon-animated">
						<i class="fa fa-circle-o-notch fa-spin"></i>
					</span>
					<a href="#" class="widget-toggle-hidden-option">
						<i class="fa fa-cog"></i>
					</a>
					<a href="#" class="widget-collapse-option" data-toggle="collapse">
						<i class="fa fa-chevron-up"></i>
					</a>
					<a href="#" class="widget-refresh-option">
						<i class="fa fa-refresh"></i>
					</a>
					<a href="#" class="widget-remove-option">
						<i class="fa fa-times"></i>
					</a>
				</span>
			</div>
			<div class="smart-widget-inner">
				<div class="smart-widget-hidden-section">
					<ul class="widget-color-list clearfix">
						<li style="background-color:#20232b;" data-color="widget-dark"></li>
						<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
						<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
						<li style="background-color:#2baab1;" data-color="widget-green"></li>
						<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
						<li style="background-color:#fbc852;" data-color="widget-orange"></li>
						<li style="background-color:#e36159;" data-color="widget-red"></li>
						<li style="background-color:#7266ba;" data-color="widget-purple"></li>
						<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
						<li style="background-color:#fff;" data-color="reset"></li>
					</ul>
				</div>
				<div class="smart-widget-body">
					<!-- /admin/student/studentAddData -->
					<form action="" method="POST" enctype="multipart/form-data">
						<div class="form-group">
							<label>选择班级</label>
							<select class="form-control" name="class_id">
								<option value="">请选择</option>
								{{#each(clsList)}}
								<option value="{{this.class_id}}">{{this.class_name}}</option>
								{{/each}}
							</select>
						</div><!-- /form-group -->
						<div class="form-group">
							<label for="exampleInputEmail1">学生姓名</label>
							<input type="text" class="form-control" id="exampleInputEmail1" placeholder="请输入学生姓名"
								name="stu_name" required>
						</div><!-- /form-group -->
						<div class="form-group">
							<label for="exampleInputEmail2">学生年龄</label>
							<input type="text" class="form-control" id="exampleInputEmail2" placeholder="请输入学生年龄"
								name="stu_age" required>
						</div><!-- /form-group -->
						<div class="form-group">
							<label for="exampleInputEmail3">手机号码</label>
							<input type="text" class="form-control" id="exampleInputEmail3" placeholder="请输入手机号码"
								name="stu_phone" required>
						</div><!-- /form-group -->
						<div class="form-group">
							<label>选择性别</label>
							<div class="col-lg-12">
								<div class="radio inline-block">
									<div class="custom-radio m-right-xs">
										<input type="radio" id="inlineRadio1" name="stu_sex" value="0" checked>
										<label for="inlineRadio1"></label>
									</div>
									<div class="inline-block vertical-top">女</div>
								</div>
								<div class="radio inline-block">
									<div class="custom-radio m-right-xs">
										<input type="radio" id="inlineRadio2" name="stu_sex" value="1">
										<label for="inlineRadio2"></label>
									</div>
									<div class="inline-block vertical-top">男</div>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label>报名时间</label>
							<div class="input-group">
								<input class="datetimepicker-input form-control" data-date-format="YYYY-MM-DD"
									name="stu_time" type="text" required />
								<span class="input-group-addon"><i class="fa fa-clock-o"></i></span>
							</div>
						</div><!-- /form-group -->
						<div class="form-group">
							<label>上传头像</label>
							<div class="col-lg-12 input-group">
								<input type="file" class="form-control" name="stu_img" required>
							</div><!-- /.col -->
						</div>
						<div class="form-group">
							<label>选择课程</label>
							<div class="input-group">
								{{#each(subList)}}
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" name="subids[]" value="{{this.sub_id}}"
											id="inlineCheckbox{{xindex+1}}" class="checkbox-red checks">
										<label for="inlineCheckbox{{xindex+1}}"></label>
									</div>
									<div class="inline-block vertical-top" style="margin-right: 10px;">
										{{this.sub_name}}
									</div>
								</div>
								{{/each}}
							</div>
						</div><!-- /form-group -->
						<button type="submit" class="btn btn-success btn-sm">提交</button>
					</form>
				</div>
			</div><!-- ./smart-widget-inner -->
		</div><!-- ./smart-widget -->

		<div class="smart-widget widget-purple" style="display: none;">
			<div class="smart-widget-header">
				Horizontal Form
				<span class="smart-widget-option">
					<span class="refresh-icon-animated">
						<i class="fa fa-circle-o-notch fa-spin"></i>
					</span>
					<a href="#" class="widget-toggle-hidden-option">
						<i class="fa fa-cog"></i>
					</a>
					<a href="#" class="widget-collapse-option" data-toggle="collapse">
						<i class="fa fa-chevron-up"></i>
					</a>
					<a href="#" class="widget-refresh-option">
						<i class="fa fa-refresh"></i>
					</a>
					<a href="#" class="widget-remove-option">
						<i class="fa fa-times"></i>
					</a>
				</span>
			</div>
			<div class="smart-widget-inner">
				<div class="smart-widget-hidden-section">
					<ul class="widget-color-list clearfix">
						<li style="background-color:#20232b;" data-color="widget-dark"></li>
						<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
						<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
						<li style="background-color:#2baab1;" data-color="widget-green"></li>
						<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
						<li style="background-color:#fbc852;" data-color="widget-orange"></li>
						<li style="background-color:#e36159;" data-color="widget-red"></li>
						<li style="background-color:#7266ba;" data-color="widget-purple"></li>
						<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
						<li style="background-color:#fff;" data-color="reset"></li>
					</ul>
				</div>
				<div class="smart-widget-body">
					<form class="form-horizontal">
						<div class="form-group">
							<label for="inputEmail1" class="col-lg-2 control-label">Email</label>
							<div class="col-lg-10">
								<input type="email" class="form-control" id="inputEmail1" placeholder="Email">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label for="inputPassword1" class="col-lg-2 control-label">Password</label>
							<div class="col-lg-10">
								<input type="password" class="form-control" id="inputPassword1" placeholder="Password">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<div class="col-lg-offset-2 col-lg-10">
								<div class="custom-checkbox">
									<input type="checkbox" id="chk2">
									<label for="chk2"></label>
								</div>
								Remember me
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<div class="col-lg-offset-2 col-lg-10">
								<button type="submit" class="btn btn-success btn-sm">Sign in</button>
							</div><!-- /.col -->
						</div><!-- /form-group -->
					</form>
				</div>
			</div><!-- ./smart-widget-inner -->
		</div><!-- ./smart-widget -->

		<div class="smart-widget" style="display: none;">
			<div class="smart-widget-header">
				Inline form
				<span class="smart-widget-option">
					<span class="refresh-icon-animated">
						<i class="fa fa-circle-o-notch fa-spin"></i>
					</span>
					<a href="#" class="widget-toggle-hidden-option">
						<i class="fa fa-cog"></i>
					</a>
					<a href="#" class="widget-collapse-option" data-toggle="collapse">
						<i class="fa fa-chevron-up"></i>
					</a>
					<a href="#" class="widget-refresh-option">
						<i class="fa fa-refresh"></i>
					</a>
					<a href="#" class="widget-remove-option">
						<i class="fa fa-times"></i>
					</a>
				</span>
			</div>
			<div class="smart-widget-inner">
				<div class="smart-widget-hidden-section">
					<ul class="widget-color-list clearfix">
						<li style="background-color:#20232b;" data-color="widget-dark"></li>
						<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
						<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
						<li style="background-color:#2baab1;" data-color="widget-green"></li>
						<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
						<li style="background-color:#fbc852;" data-color="widget-orange"></li>
						<li style="background-color:#e36159;" data-color="widget-red"></li>
						<li style="background-color:#7266ba;" data-color="widget-purple"></li>
						<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
						<li style="background-color:#fff;" data-color="reset"></li>
					</ul>
				</div>
				<div class="smart-widget-body">
					<form class="form-inline no-margin">
						<div class="form-group">
							<label class="sr-only">Email address</label>
							<input type="text" class="form-control" placeholder="Email Address">
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="sr-only">Password</label>
							<input type="password" class="form-control" placeholder="Password">
						</div><!-- /form-group -->
						<div class="checkbox">
							<div class="custom-checkbox">
								<input type="checkbox" id="inlineFormCheckbox">
								<label for="inlineFormCheckbox"></label>
							</div>
							Remember me
						</div><!-- /checkbox -->
						<button type="submit" class="btn btn-sm btn-success">Sign in</button>
					</form>
				</div>
			</div><!-- ./smart-widget-inner -->
		</div><!-- ./smart-widget -->

		<div class="smart-widget" style="display: none;">
			<div class="smart-widget-header">
				Search form
				<span class="smart-widget-option">
					<span class="refresh-icon-animated">
						<i class="fa fa-circle-o-notch fa-spin"></i>
					</span>
					<a href="#" class="widget-toggle-hidden-option">
						<i class="fa fa-cog"></i>
					</a>
					<a href="#" class="widget-collapse-option" data-toggle="collapse">
						<i class="fa fa-chevron-up"></i>
					</a>
					<a href="#" class="widget-refresh-option">
						<i class="fa fa-refresh"></i>
					</a>
					<a href="#" class="widget-remove-option">
						<i class="fa fa-times"></i>
					</a>
				</span>
			</div>
			<div class="smart-widget-inner">
				<div class="smart-widget-hidden-section">
					<ul class="widget-color-list clearfix">
						<li style="background-color:#20232b;" data-color="widget-dark"></li>
						<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
						<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
						<li style="background-color:#2baab1;" data-color="widget-green"></li>
						<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
						<li style="background-color:#fbc852;" data-color="widget-orange"></li>
						<li style="background-color:#e36159;" data-color="widget-red"></li>
						<li style="background-color:#7266ba;" data-color="widget-purple"></li>
						<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
						<li style="background-color:#fff;" data-color="reset"></li>
					</ul>
				</div>
				<div class="smart-widget-body">
					<form class="form-inline no-margin">
						<div class="row">
							<div class="col-md-5">
								<div class="input-group">
									<input type="text" class="form-control">
									<div class="input-group-btn">
										<button type="button" class="btn btn-success no-shadow"
											tabindex="-1">Search</button>
										<button type="button" class="btn btn-success dropdown-toggle no-shadow"
											data-toggle="dropdown" tabindex="-1">
											Options
										</button>
										<ul class="dropdown-menu pull-right" role="menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
										</ul>
									</div> <!-- /input-group-btn -->
								</div> <!-- /input-group -->
							</div><!-- /.col -->
						</div><!-- /.row -->
					</form>
				</div>
			</div><!-- ./smart-widget-inner -->
		</div><!-- ./smart-widget -->

		<div class="smart-widget" style="display: none;">
			<div class="smart-widget-header">
				Slider
				<span class="smart-widget-option">
					<span class="refresh-icon-animated">
						<i class="fa fa-circle-o-notch fa-spin"></i>
					</span>
					<a href="#" class="widget-toggle-hidden-option">
						<i class="fa fa-cog"></i>
					</a>
					<a href="#" class="widget-collapse-option" data-toggle="collapse">
						<i class="fa fa-chevron-up"></i>
					</a>
					<a href="#" class="widget-refresh-option">
						<i class="fa fa-refresh"></i>
					</a>
					<a href="#" class="widget-remove-option">
						<i class="fa fa-times"></i>
					</a>
				</span>
			</div>
			<div class="smart-widget-inner">
				<div class="smart-widget-hidden-section">
					<ul class="widget-color-list clearfix">
						<li style="background-color:#20232b;" data-color="widget-dark"></li>
						<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
						<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
						<li style="background-color:#2baab1;" data-color="widget-green"></li>
						<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
						<li style="background-color:#fbc852;" data-color="widget-orange"></li>
						<li style="background-color:#e36159;" data-color="widget-red"></li>
						<li style="background-color:#7266ba;" data-color="widget-purple"></li>
						<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
						<li style="background-color:#fff;" data-color="reset"></li>
					</ul>
				</div>
				<div class="smart-widget-body">
					<div class="row">
						<div class="col-md-6">
							<div class="paddingTB-sm"><input type="text" class="form-control" data-slider-value="4"
									id="horizontalSlider1" data-slider-handle="round"></div>
							<div class="paddingTB-sm"><input type="text" class="form-control" data-slider-value="12"
									id="horizontalSlider2" data-slider-handle="round" data-slider-min="0"
									data-slider-max="20"></div>
							<div class="paddingTB-sm"><input type="text" class="form-control" data-slider-value="40"
									id="horizontalSlider3" data-slider-handle="round" data-slider-min="0"
									data-slider-max="100" data-slider-step="10"></div>
							<div class="paddingTB-sm"><input type="text" class="form-control" id="horizontalSlider4"
									data-slider-min="10" data-slider-max="1000" data-slider-step="5"
									data-slider-value="[150,650]"></div>
						</div><!-- ./col -->
						<div class="col-md-6">
							<input type="text" class="form-control" id="verticalSlider1" data-slider-value="-13"
								data-slider-min="-20" data-slider-max="20" data-slider-handle="round"
								data-slider-orientation="vertical">
							<input type="text" class="form-control" id="verticalSlider2" data-slider-value="5"
								data-slider-min="0" data-slider-max="20" data-slider-handle="round"
								data-slider-orientation="vertical">
							<input type="text" class="form-control" id="verticalSlider3" data-slider-value="35"
								data-slider-min="0" data-slider-max="50" data-slider-handle="round"
								data-slider-orientation="vertical">
							<input type="text" class="form-control" id="verticalSlider4" data-slider-value="87"
								data-slider-min="0" data-slider-max="100" data-slider-handle="round"
								data-slider-orientation="vertical">
							<input type="text" class="form-control" id="verticalSlider5" data-slider-value="50"
								data-slider-min="21" data-slider-max="100" data-slider-handle="round"
								data-slider-orientation="vertical">

						</div><!-- ./col -->
					</div><!-- ./row -->
				</div>
			</div><!-- ./smart-widget-inner -->
		</div><!-- ./smart-widget -->

		<div class="smart-widget" style="display: none;">
			<div class="smart-widget-header">
				Form Element
				<span class="smart-widget-option">
					<span class="refresh-icon-animated">
						<i class="fa fa-circle-o-notch fa-spin"></i>
					</span>
					<a href="#" class="widget-toggle-hidden-option">
						<i class="fa fa-cog"></i>
					</a>
					<a href="#" class="widget-collapse-option" data-toggle="collapse">
						<i class="fa fa-chevron-up"></i>
					</a>
					<a href="#" class="widget-refresh-option">
						<i class="fa fa-refresh"></i>
					</a>
					<a href="#" class="widget-remove-option">
						<i class="fa fa-times"></i>
					</a>
				</span>
			</div>
			<div class="smart-widget-inner">
				<div class="smart-widget-hidden-section">
					<ul class="widget-color-list clearfix">
						<li style="background-color:#20232b;" data-color="widget-dark"></li>
						<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
						<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
						<li style="background-color:#2baab1;" data-color="widget-green"></li>
						<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
						<li style="background-color:#fbc852;" data-color="widget-orange"></li>
						<li style="background-color:#e36159;" data-color="widget-red"></li>
						<li style="background-color:#7266ba;" data-color="widget-purple"></li>
						<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
						<li style="background-color:#fff;" data-color="reset"></li>
					</ul>
				</div>
				<div class="smart-widget-body">
					<form id="formToggleLine" class="form-horizontal no-margin form-border">
						<div class="form-group">
							<label class="col-lg-2 control-label">Help Text</label>
							<div class="col-lg-10">
								<input class="form-control" type="text" placeholder="input here...">
								<span class="help-block">A block of help text that breaks onto a new line and may extend
									beyond one line.</span>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Disabled</label>
							<div class="col-lg-10">
								<input class="form-control" type="text" placeholder="Disabled input here..." disabled>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Password</label>
							<div class="col-lg-10">
								<input class="form-control" type="password" placeholder="Password">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Static Control</label>
							<div class="col-lg-10">
								<p class="form-control-static">email@example.com</p>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Textarea</label>
							<div class="col-lg-10">
								<textarea class="form-control" rows="3"></textarea>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Stacked Checkbox</label>
							<div class="col-lg-10">
								<div class="checkbox">
									<div class="custom-checkbox">
										<input type="checkbox" id="checkbox1">
										<label for="checkbox1"></label>
									</div>
									<div class="inline-block vertical-top">
										Option one is this and that be sure to include why it's great
									</div>
								</div>
								<div class="checkbox">
									<div class="custom-checkbox">
										<input type="checkbox" id="checkbox2">
										<label for="checkbox2"></label>
									</div>
									<div class="inline-block vertical-top">
										Option two can be something else and selecting it will deselect option on
									</div>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Inline Checkbox</label>
							<div class="col-lg-10">
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" id="inlineCheckbox1" class="checkbox-red" checked>
										<label for="inlineCheckbox1"></label>
									</div>
									<div class="inline-block vertical-top">
										Checkbox 1
									</div>
								</div>
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" id="inlineCheckbox2" checked>
										<label for="inlineCheckbox2"></label>
									</div>
									<div class="inline-block vertical-top">
										Checkbox 2
									</div>
								</div>
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" id="inlineCheckbox3" class="checkbox-purple" checked>
										<label for="inlineCheckbox3"></label>
									</div>
									<div class="inline-block vertical-top">
										Checkbox 3
									</div>
								</div>
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" id="inlineCheckbox4" class="checkbox-blue" checked>
										<label for="inlineCheckbox4"></label>
									</div>
									<div class="inline-block vertical-top">
										Checkbox 4
									</div>
								</div>
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" id="inlineCheckbox5" class="checkbox-yellow" checked>
										<label for="inlineCheckbox5"></label>
									</div>
									<div class="inline-block vertical-top">
										Checkbox 5
									</div>
								</div>
								<div class="checkbox inline-block">
									<div class="custom-checkbox">
										<input type="checkbox" id="inlineCheckbox6" class="checkbox-grey" checked>
										<label for="inlineCheckbox6"></label>
									</div>
									<div class="inline-block vertical-top">
										Checkbox 6
									</div>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Stacked Radio Button</label>
							<div class="col-lg-10">
								<div class="radio">
									<div class="custom-radio m-right-xs">
										<input type="radio" id="radio1" name="stackRadio">
										<label for="radio1"></label>
									</div>
									<div class="inline-block vertical-top">
										Option one is this and that be sure to include why it's great
									</div>
								</div>
								<div class="radio">
									<div class="custom-radio m-right-xs">
										<input type="radio" id="radio2" name="stackRadio">
										<label for="radio2"></label>
									</div>
									<div class="inline-block vertical-top">
										Option two can be something else and selecting it will deselect option one
									</div>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Inline Radio Button</label>
							<div class="col-lg-10">
								<div class="radio inline-block">
									<div class="custom-radio m-right-xs">
										<input type="radio" id="inlineRadio1" name="inlineRadio">
										<label for="inlineRadio1"></label>
									</div>
									<div class="inline-block vertical-top">Option 1</div>
								</div>
								<div class="radio inline-block">
									<div class="custom-radio m-right-xs">
										<input type="radio" id="inlineRadio2" name="inlineRadio">
										<label for="inlineRadio2"></label>
									</div>
									<div class="inline-block vertical-top">Option 2</div>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group has-success">
							<label class="col-lg-2 control-label">Input with success</label>
							<div class="col-lg-10">
								<input class="form-control" type="text">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group has-warning">
							<label class="col-lg-2 control-label">Input with success</label>
							<div class="col-lg-10">
								<input class="form-control" type="text">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group has-error">
							<label class="col-lg-2 control-label">Input with error</label>
							<div class="col-lg-10">
								<input class="form-control" type="text">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Select</label>
							<div class="col-lg-10">
								<select class="form-control">
									<option>1</option>
									<option>2</option>
									<option>3</option>
									<option>4</option>
									<option>5</option>
								</select>

								<select class="form-control m-top-md">
									<optgroup label="Alaskan/Hawaiian Time Zone">
										<option value="AK">Alaska</option>
										<option value="HI">Hawaii</option>
									</optgroup>
									<optgroup label="Pacific Time Zone">
										<option value="CA">California</option>
										<option value="NV">Nevada</option>
										<option value="OR">Oregon</option>
										<option value="WA">Washington</option>
									</optgroup>
									<optgroup label="Mountain Time Zone">
										<option value="AZ">Arizona</option>
										<option value="CO">Colorado</option>
										<option value="ID">Idaho</option>
										<option value="MT">Montana</option>
										<option value="NE">Nebraska</option>
										<option value="NM">New Mexico</option>
										<option value="ND">North Dakota</option>
										<option value="UT">Utah</option>
										<option value="WY">Wyoming</option>
									</optgroup>
									<optgroup label="Central Time Zone">
										<option value="AL">Alabama</option>
										<option value="AR">Arkansas</option>
										<option value="IL">Illinois</option>
										<option value="IA">Iowa</option>
										<option value="KS">Kansas</option>
										<option value="KY">Kentucky</option>
										<option value="LA">Louisiana</option>
										<option value="MN">Minnesota</option>
										<option value="MS">Mississippi</option>
										<option value="MO">Missouri</option>
										<option value="OK">Oklahoma</option>
										<option value="SD">South Dakota</option>
										<option value="TX">Texas</option>
										<option value="TN">Tennessee</option>
										<option value="WI">Wisconsin</option>
									</optgroup>
									<optgroup label="Eastern Time Zone">
										<option value="CT">Connecticut</option>
										<option value="DE">Delaware</option>
										<option value="FL">Florida</option>
										<option value="GA">Georgia</option>
										<option value="IN">Indiana</option>
										<option value="ME">Maine</option>
										<option value="MD">Maryland</option>
										<option value="MA">Massachusetts</option>
										<option value="MI">Michigan</option>
										<option value="NH">New Hampshire</option>
										<option value="NJ">New Jersey</option>
										<option value="NY">New York</option>
										<option value="NC">North Carolina</option>
										<option value="OH">Ohio</option>
										<option value="PA">Pennsylvania</option>
										<option value="RI">Rhode Island</option>
										<option value="SC">South Carolina</option>
										<option value="VT">Vermont</option>
										<option value="VA">Virginia</option>
										<option value="WV">West Virginia</option>
									</optgroup>
								</select>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Select2</label>
							<div class="col-lg-10">
								<select class="select2 width-100">
									<option>Alabama</option>
									<option>Alaska</option>
									<option>Arizona</option>
									<option>Arkansas</option>
									<option>California</option>
									<option>Colorado</option>
									<option>Connecticut</option>
									<option>Delaware</option>
									<option>District Of Columbia</option>
									<option>Florida</option>
									<option>Georgia</option>
									<option>Hawaii</option>
									<option>Idaho</option>
									<option>Illinois</option>
									<option>Indiana</option>
									<option>Iowa</option>
									<option>Kansas</option>
									<option>Kentucky</option>
									<option>Louisiana</option>
									<option>Maine</option>
									<option>Maryland</option>
									<option>Massachusetts</option>
									<option>Michigan</option>
									<option>Minnesota</option>
									<option>Mississippi</option>
									<option>Missouri</option>
									<option>Montana</option>
									<option>Nebraska</option>
									<option>Nevada</option>
									<option>New Hampshire</option>
									<option>New Jersey</option>
									<option>New Mexico</option>
									<option>New York</option>
									<option>North Carolina</option>
									<option>North Dakota</option>
									<option>Ohio</option>
									<option>Oklahoma</option>
									<option>Oregon</option>
									<option>Pennsylvania</option>
									<option>Rhode Island</option>
									<option>South Carolina</option>
									<option>South Dakota</option>
									<option>Tennessee</option>
									<option>Texas</option>
									<option>Utah</option>
									<option>Vermont</option>
									<option>Virginia</option>
									<option>Washington</option>
									<option>West Virginia</option>
									<option>Wisconsin</option>
									<option>Wyoming</option>
								</select>

								<select class="select2 m-top-md width-100">
									<optgroup label="Alaskan/Hawaiian Time Zone">
										<option value="AK">Alaska</option>
										<option value="HI">Hawaii</option>
									</optgroup>
									<optgroup label="Pacific Time Zone">
										<option value="CA">California</option>
										<option value="NV">Nevada</option>
										<option value="OR">Oregon</option>
										<option value="WA">Washington</option>
									</optgroup>
									<optgroup label="Mountain Time Zone">
										<option value="AZ">Arizona</option>
										<option value="CO">Colorado</option>
										<option value="ID">Idaho</option>
										<option value="MT">Montana</option>
										<option value="NE">Nebraska</option>
										<option value="NM">New Mexico</option>
										<option value="ND">North Dakota</option>
										<option value="UT">Utah</option>
										<option value="WY">Wyoming</option>
									</optgroup>
									<optgroup label="Central Time Zone">
										<option value="AL">Alabama</option>
										<option value="AR">Arkansas</option>
										<option value="IL">Illinois</option>
										<option value="IA">Iowa</option>
										<option value="KS">Kansas</option>
										<option value="KY">Kentucky</option>
										<option value="LA">Louisiana</option>
										<option value="MN">Minnesota</option>
										<option value="MS">Mississippi</option>
										<option value="MO">Missouri</option>
										<option value="OK">Oklahoma</option>
										<option value="SD">South Dakota</option>
										<option value="TX">Texas</option>
										<option value="TN">Tennessee</option>
										<option value="WI">Wisconsin</option>
									</optgroup>
									<optgroup label="Eastern Time Zone">
										<option value="CT">Connecticut</option>
										<option value="DE">Delaware</option>
										<option value="FL">Florida</option>
										<option value="GA">Georgia</option>
										<option value="IN">Indiana</option>
										<option value="ME">Maine</option>
										<option value="MD">Maryland</option>
										<option value="MA">Massachusetts</option>
										<option value="MI">Michigan</option>
										<option value="NH">New Hampshire</option>
										<option value="NJ">New Jersey</option>
										<option value="NY">New York</option>
										<option value="NC">North Carolina</option>
										<option value="OH">Ohio</option>
										<option value="PA">Pennsylvania</option>
										<option value="RI">Rhode Island</option>
										<option value="SC">South Carolina</option>
										<option value="VT">Vermont</option>
										<option value="VA">Virginia</option>
										<option value="WV">West Virginia</option>
									</optgroup>
								</select>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Multiple Select</label>
							<div class="col-lg-10">
								<select multiple class="form-control">
									<optgroup label="Alaskan/Hawaiian Time Zone">
										<option value="AK">Alaska</option>
										<option value="HI">Hawaii</option>
									</optgroup>
									<optgroup label="Pacific Time Zone">
										<option value="CA">California</option>
										<option value="NV">Nevada</option>
										<option value="OR">Oregon</option>
										<option value="WA">Washington</option>
									</optgroup>
									<optgroup label="Mountain Time Zone">
										<option value="AZ">Arizona</option>
										<option value="CO">Colorado</option>
										<option value="ID">Idaho</option>
										<option value="MT">Montana</option>
										<option value="NE">Nebraska</option>
										<option value="NM">New Mexico</option>
										<option value="ND">North Dakota</option>
										<option value="UT">Utah</option>
										<option value="WY">Wyoming</option>
									</optgroup>
									<optgroup label="Central Time Zone">
										<option value="AL">Alabama</option>
										<option value="AR">Arkansas</option>
										<option value="IL">Illinois</option>
										<option value="IA">Iowa</option>
										<option value="KS">Kansas</option>
										<option value="KY">Kentucky</option>
										<option value="LA">Louisiana</option>
										<option value="MN">Minnesota</option>
										<option value="MS">Mississippi</option>
										<option value="MO">Missouri</option>
										<option value="OK">Oklahoma</option>
										<option value="SD">South Dakota</option>
										<option value="TX">Texas</option>
										<option value="TN">Tennessee</option>
										<option value="WI">Wisconsin</option>
									</optgroup>
									<optgroup label="Eastern Time Zone">
										<option value="CT">Connecticut</option>
										<option value="DE">Delaware</option>
										<option value="FL">Florida</option>
										<option value="GA">Georgia</option>
										<option value="IN">Indiana</option>
										<option value="ME">Maine</option>
										<option value="MD">Maryland</option>
										<option value="MA">Massachusetts</option>
										<option value="MI">Michigan</option>
										<option value="NH">New Hampshire</option>
										<option value="NJ">New Jersey</option>
										<option value="NY">New York</option>
										<option value="NC">North Carolina</option>
										<option value="OH">Ohio</option>
										<option value="PA">Pennsylvania</option>
										<option value="RI">Rhode Island</option>
										<option value="SC">South Carolina</option>
										<option value="VT">Vermont</option>
										<option value="VA">Virginia</option>
										<option value="WV">West Virginia</option>
									</optgroup>
								</select>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Multiple Select2</label>
							<div class="col-lg-10">
								<select multiple class="select2 width-100">
									<optgroup label="Alaskan/Hawaiian Time Zone">
										<option value="AK">Alaska</option>
										<option value="HI">Hawaii</option>
									</optgroup>
									<optgroup label="Pacific Time Zone">
										<option value="CA">California</option>
										<option value="NV">Nevada</option>
										<option value="OR">Oregon</option>
										<option value="WA">Washington</option>
									</optgroup>
									<optgroup label="Mountain Time Zone">
										<option value="AZ">Arizona</option>
										<option value="CO">Colorado</option>
										<option value="ID">Idaho</option>
										<option value="MT">Montana</option>
										<option value="NE">Nebraska</option>
										<option value="NM">New Mexico</option>
										<option value="ND">North Dakota</option>
										<option value="UT">Utah</option>
										<option value="WY">Wyoming</option>
									</optgroup>
									<optgroup label="Central Time Zone">
										<option value="AL">Alabama</option>
										<option value="AR">Arkansas</option>
										<option value="IL">Illinois</option>
										<option value="IA">Iowa</option>
										<option value="KS">Kansas</option>
										<option value="KY">Kentucky</option>
										<option value="LA">Louisiana</option>
										<option value="MN">Minnesota</option>
										<option value="MS">Mississippi</option>
										<option value="MO">Missouri</option>
										<option value="OK">Oklahoma</option>
										<option value="SD">South Dakota</option>
										<option value="TX">Texas</option>
										<option value="TN">Tennessee</option>
										<option value="WI">Wisconsin</option>
									</optgroup>
									<optgroup label="Eastern Time Zone">
										<option value="CT">Connecticut</option>
										<option value="DE">Delaware</option>
										<option value="FL">Florida</option>
										<option value="GA">Georgia</option>
										<option value="IN">Indiana</option>
										<option value="ME">Maine</option>
										<option value="MD">Maryland</option>
										<option value="MA">Massachusetts</option>
										<option value="MI">Michigan</option>
										<option value="NH">New Hampshire</option>
										<option value="NJ">New Jersey</option>
										<option value="NY">New York</option>
										<option value="NC">North Carolina</option>
										<option value="OH">Ohio</option>
										<option value="PA">Pennsylvania</option>
										<option value="RI">Rhode Island</option>
										<option value="SC">South Carolina</option>
										<option value="VT">Vermont</option>
										<option value="VA">Virginia</option>
										<option value="WV">West Virginia</option>
									</optgroup>
								</select>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Height sizing</label>
							<div class="col-lg-10">
								<input class="form-control input-lg" type="text" placeholder=".input-lg">
								<div class="seperator"></div>
								<input class="form-control" type="text" placeholder="Default input">
								<div class="seperator"></div>
								<input class="form-control input-sm" type="text" placeholder=".input-sm">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Column sizing</label>
							<div class="col-lg-10">
								<div class="row">
									<div class="col-lg-2">
										<input type="text" class="form-control" placeholder=".col-lg-2">
									</div><!-- /.col -->
									<div class="col-lg-3">
										<input type="text" class="form-control" placeholder=".col-lg-3">
									</div><!-- /.col -->
									<div class="col-lg-4">
										<input type="text" class="form-control" placeholder=".col-lg-4">
									</div><!-- /.col -->
								</div><!-- /.row -->
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Input Groups</label>
							<div class="col-lg-10">
								<div class="input-group">
									<span class="input-group-addon">@</span>
									<input type="text" class="form-control" placeholder="Username">
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<input type="text" class="form-control">
									<span class="input-group-addon">.00</span>
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<span class="input-group-addon">$</span>
									<input type="text" class="form-control">
									<span class="input-group-addon">.00</span>
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<span class="input-group-addon">
										<span class="custom-checkbox">
											<input type="checkbox" id="inputGroupCheckbox">
											<label for="inputGroupCheckbox"></label>
										</span>
									</span>
									<input type="text" class="form-control">
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<span class="input-group-addon">
										<span class="custom-radio m-right-xs">
											<input type="radio" id="inputGroupRadio" name="inputGroupRadio">
											<label for="inputGroupRadio"></label>
										</span>
									</span>
									<input type="text" class="form-control">
								</div><!-- /input-group -->
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Button addons</label>
							<div class="col-lg-10">
								<div class="input-group">
									<span class="input-group-btn">
										<button class="btn btn-default" type="button">Go!</button>
									</span>
									<input type="text" class="form-control">
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<input type="text" class="form-control">
									<span class="input-group-btn">
										<button class="btn btn-default" type="button">Go!</button>
									</span>
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<div class="input-group-btn">
										<button type="button" class="btn btn-default dropdown-toggle"
											data-toggle="dropdown">Action <span class="caret"></span></button>
										<ul class="dropdown-menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
										</ul>
									</div><!-- /btn-group -->
									<input type="text" class="form-control">
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<input type="text" class="form-control">
									<div class="input-group-btn">
										<button type="button" class="btn btn-default dropdown-toggle"
											data-toggle="dropdown">Action <span class="caret"></span></button>
										<ul class="dropdown-menu pull-right">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
										</ul>
									</div><!-- /btn-group -->
								</div><!-- /input-group -->
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Segmented buttons</label>
							<div class="col-lg-10">
								<div class="input-group">
									<div class="input-group-btn">
										<button type="button" class="btn btn-default" tabindex="-1">Action</button>
										<button type="button" class="btn btn-default dropdown-toggle"
											data-toggle="dropdown" tabindex="-1">
											<span class="caret"></span>
										</button>
										<ul class="dropdown-menu" role="menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
										</ul>
									</div>
									<input type="text" class="form-control">
								</div><!-- /input-group -->
								<div class="seperator"></div>
								<div class="input-group">
									<input type="text" class="form-control">
									<div class="input-group-btn">
										<button type="button" class="btn btn-default" tabindex="-1">Action</button>
										<button type="button" class="btn btn-default dropdown-toggle"
											data-toggle="dropdown" tabindex="-1">
											<span class="caret"></span>
										</button>
										<ul class="dropdown-menu pull-right" role="menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
										</ul>
									</div>
								</div><!-- /input-group -->
							</div><!-- /.col -->
						</div><!-- /form-group -->

						<div class="form-group">
							<label class="col-lg-2 control-label">File Upload</label>
							<div class="col-lg-10">
								<input type="file">
							</div><!-- /.col -->
						</div><!-- /form-group -->

						<div class="form-group">
							<label class="col-lg-2 control-label">Tags</label>
							<div class="col-lg-10">
								<input type="text" id="tagsExample" value="one,two,three">
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Date Picker</label>
							<div class="col-lg-10">
								<div class="input-group">
									<input type="text" value="08/10/2014" class="datepicker-input form-control">
									<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Time Picker</label>
							<div class="col-lg-10">
								<div class="input-group">
									<input class="timepicker-input form-control" type="text" />
									<span class="input-group-addon"><i class="fa fa-clock-o"></i></span>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Date & Time Picker</label>
							<div class="col-lg-10">
								<div class="input-group">
									<input class="datetimepicker-input form-control" type="text" />
									<span class="input-group-addon"><i class="fa fa-clock-o"></i></span>
								</div>
							</div><!-- /.col -->
						</div><!-- /form-group -->
						<div class="form-group">
							<label class="col-lg-2 control-label">Form in modal</label>
							<div class="col-lg-10">
								<a href="#formInModal" class="btn btn-danger" data-toggle="modal">Form In Modal</a>
							</div><!-- /.col -->
						</div><!-- /form-group -->
					</form>
				</div>
			</div><!-- ./smart-widget-inner -->
		</div><!-- ./smart-widget -->
	</div><!-- ./padding-md -->
</div><!-- /main-container -->
{{/block}}